<!DOCTYPE HTML>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Alpona - A Clean Responsive Flat B3 Admin Template</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="Admin Panel Template">
        <!-- styles -->
        <link href="css/bootstrap.css" rel="stylesheet">
        <link href="css/font-alpona.css" rel="stylesheet">
        <link href="css/prettify.css" rel="stylesheet">
        <link href="css/responsive-tables.css" rel="stylesheet">
        <link href="css/styles.css" rel="stylesheet">
        <link href="css/bootstrap-reset.css" rel="stylesheet">
        <!--fav and touch icons -->
        <link rel="shortcut icon" href="ico/favicon.ico">
        <link rel="apple-touch-icon-precomposed" sizes="144x144" href="ico/apple-touch-icon-144-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="114x114" href="ico/apple-touch-icon-114-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="72x72" href="ico/apple-touch-icon-72-precomposed.png">
        <link rel="apple-touch-icon-precomposed" href="ico/apple-touch-icon-57-precomposed.png">
        <script src="js/jquery.js"></script>
        <!--[if lt IE 9]>
        <script src="js/respond.min.js"></script>
        <![endif]-->
    </head>
    <body>
        <div class="main-wrapper">
            <div class="scroll-top">
                <a href="#" class="tip-top" title="Go Top"><i class="icon-arrow-up"></i></a>
            </div>
            <!-- TOP BAR -->
            <div class="top-bar">
                <div class="container">
                    <div class="row">
                        <div class="col-sm-4 col-md-4">
                            <a href="#" class="left-toggle"><i class="icon-menu-2 "></i></a>
                            <!-- LOGO -->
                            <div class="branding">
                                <a href="index.html"><img src="images/alpona-logo.png" alt="Alpona Logo"></a>
                            </div>
                        </div>
                        <div class="col-sm-4 col-md-4 responsive-notification-mnu">
                            <ul class="notification-bar">
                                <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-bell"></i></a>
                                    <div class="dropdown-menu">
                                        <div class="dropdown-head">
                                            <h6>You have 10 new notifications</h6>
                                        </div>
                                        <ul class="notification-list">
                                            <li><a href="#" class="clearfix"><i class="icon-star blue"></i><span class="notification-intro">Donec pretium enim vel nisl viverra posuere.<span class="notification-time">8 min ago</span></span></a></li>
                                            <li><a href="#" class="clearfix"><i class=" icon-bell orange"></i><span class="notification-intro">Vestibulum viverra magna vitae dui volutpat dapibus. <span class="notification-time">3 hours ago</span></span></a></li>
                                            <li><a href="#" class="clearfix"><i class=" icon-bolt brown"></i><span class="notification-intro">Fusce eget ipsum in odio consectetur condimentum et id nisl.<span class="notification-time">5 hours ago</span></span></a></li>
                                            <li><a href="#" class="clearfix"><i class=" icon-ok-sign green"></i><span class="notification-intro">Mauris fringilla metus in mauris molestie tempor <span class="notification-time">8 hours ago</span></span></a></li>
                                        </ul>
                                        <div class="action-btn">
                                            <button class="btn btn-block">View All</button>
                                        </div>
                                    </div>
                                </li>
                                <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="count-noty">12</span><i class="icon-envelop-opened"></i></a>
                                    <div class="dropdown-menu">
                                        <div class="dropdown-head">
                                            <h6>You have 32 new messages</h6>
                                        </div>
                                        <ul class="msg-list">
                                            <li class="clearfix"><a href="#"><span class="dropdown-thumb"><img width="40" height="40" alt="Avatar" src="images/avatar-40x40/binjal.png"></span><span><i>binjal</i> is posted an article. lacus est congue... </span><span class="notification-meta"> 12 hours ago </span></a></li>
                                            <li class="clearfix"><a href="#"><span class="dropdown-thumb"><img width="40" height="40" alt="Avatar" src="images/avatar-40x40/sharmin.png"></span><span><i>sharmin</i> is posted an article. lacus est congue... </span><span class="notification-meta"> 12 hours ago </span></a></li>
                                            <li class="clearfix"><a href="#"><span class="dropdown-thumb"><img width="40" height="40" alt="Avatar" src="images/avatar-40x40/shusi.png"></span><span><i>shusi</i> is posted an article. lacus est congue... </span><span class="notification-meta"> 12 hours ago </span></a></li>
                                            <li class="clearfix"><a href="#"><span class="dropdown-thumb"><img width="40" height="40" alt="Avatar" src="images/avatar-40x40/jamjam.png"></span><span><i>jamjam</i> is posted an article. lacus est congue... </span><span class="notification-meta"> 12 hours ago </span></a></li>
                                            <li class="clearfix"><a href="#"><span class="dropdown-thumb"><img width="40" height="40" alt="Avatar" src="images/avatar-40x40/sinha.png"></span><span><i>sinha</i> is posted an article. lacus est congue... </span><span class="notification-meta"> 12 hours ago </span></a></li>
                                        </ul>
                                        <div class="action-btn">
                                            <button class="btn btn-block">View All</button>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="col-sm-4 col-md-4 clearfix responsive-log-mnu">
                            <!-- ADMIN DRODOWN MENU -->
                            <div class="loged-nav pull-right">
                                <ul class="clearfix">
                                    <li class="log-nav dropdown pull-right"><a class="dropdown-toggle clearfix" data-toggle="dropdown">
                                            <span class="pull-left loged-user-name">Sharmin Sultana</span><span class="logged-user-thumb pull-right"><img class="img-circle" src="images/admin-avatar.jpg" alt="Admin"></span></a>
                                        <div class="dropdown-menu">
                                            <ul class="pull-right">
                                                <li><a href="#">kjamanebr@gmail.com</a></li>
                                                <li><a href="#">Edit Profile</a></li>
                                                <li><a href="#">Inbox</a></li>
                                                <li class="divider"></li>
                                                <li><a href="#" class="logout-link"><i class="icon-lock-3"></i> Logout</a></li>
                                            </ul>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- LEFT BAR -->
            <div class="left-bar merge-left">
                <!-- SEARCH BAR -->
                <div class="search-bar">
                    <div class="input-group">
                        <input type="text" class="form-control">
                        <span class="input-group-btn">
                            <button class="btn btn-default" type="button"><i class="icon-search"></i></button>
                        </span>
                    </div>
                </div>
                <!-- LEFT NAV -->
                <div class="left-nav">
                    <ul class="side-navigation accordion" id="nav-accordion">
                        <li><a href="index.html"><i class="icon-home"></i> Home</a></li>
                        <li><a href="#"><i class="icon-list-alt"></i>Forms</a>
                            <ul>
                                <li><a href="form-elements.html"><i class="icon-double-angle-right"></i>All Form Elements</a></li>
                                <li><a href="extended-form-elements.html"><i class="icon-double-angle-right"></i> Extended Form Elements <span class="nav-instruction"> Lots of plugins is used here</span></a></li>
                                <li><a href="form-validation.html"><i class="icon-double-angle-right"></i>Form Validation</a></li>
                                <li><a href="form-wizard.html"><i class="icon-double-angle-right"></i>Stepy Form</a></li>
                            </ul>
                        </li>
                        <li><a href="#"><i class="icon-table-2"></i>Tables</a>
                            <ul>
                                <li><a href="basic-table.html"><i class="icon-double-angle-right"></i> Basic Tables <span class="nav-instruction"> This is an instruction</span></a></li>
                                <li><a href="table-themes.html"><i class="icon-double-angle-right"></i> Tables-Theme</a></li>
                                <li><a href="data-tables.html"><i class="icon-double-angle-right"></i> Data Tables</a></li>
                            </ul>
                        </li>
                        <li><a href="#"><i class="icon-columns"></i> Grid/Portlets</a>
                            <ul>
                                <li><a href="boxy-grids-porlets.html"><i class="icon-double-angle-right"></i> Boxy Grid/Portlets <span class="nav-instruction"> This is an instruction</span></a></li>
                                <li><a href="non-boxy-grids-porlets.html"><i class="icon-double-angle-right"></i> Non Boxy Grid/Portlets</a></li>
                            </ul>
                        </li>
                        <li><a href="#"><i class="icon-laptop"></i> Layout &AMP; Dashboard</a>
                            <ul>
                                <li><a href="blank-layout.html"><i class="icon-double-angle-right"></i> Blank Layout <span class="nav-instruction"> This is an instruction</span></a></li>
                                <li><a href="fixed-topbar.html"><i class="icon-double-angle-right"></i> Fixed Topbar</a></li>
                                <li><a href="fixed-leftbar.html"><i class="icon-double-angle-right"></i> Fixed Leftbar</a></li>
                                <li><a href="top-dropdown-menu.html"><i class="icon-double-angle-right"></i> Top Dropdown Menu</a></li>
                                <li><a href="no-sidebar.html"><i class="icon-double-angle-right"></i> No Sidebar</a></li>
                            </ul>
                        </li>
                        <li><a href="#"><i class="icon-font"></i> Typography</a>
                            <ul>
                                <li><a href="typography-boxy.html"><i class="icon-double-angle-right"></i> Boxy Typography <span class="nav-instruction"> This is an instruction</span></a></li>
                                <li><a href="typography-non-boxy.html"><i class="icon-double-angle-right"></i> Non Boxy Typography</a></li>
                            </ul>
                        </li>
                        <li><a href="#"><i class="icon-cord"></i> UI Elements</a>
                            <ul>
                                <li><a href="bootstrap-ui.html"><i class="icon-double-angle-right"></i> Bootstrap UI <span class="nav-instruction"> This is an instruction</span></a></li>
                                <li><a href="jquery-ui.html"><i class="icon-double-angle-right"></i> jQuery UI</a></li>
                                <li><a href="extended-ui-elements.html"><i class="icon-double-angle-right"></i> Extended Elements<span class="nav-instruction"> More Cool UI elements plugins </span></a></li>
                            </ul>
                        </li>
                        <li><a href="#"><i class="icon-tools"></i> Components &AMP; Plugins</a>
                            <ul>
                                <li><a href="buttons-icons.html"><i class="icon-double-angle-right"></i> Buttons &AMP; Icons</a></li>
                                <li><a href="wysiwyg.html"><i class="icon-double-angle-right"></i> WYSIWYG Text Editor</a></li>
                                <li><a href="calendar.html"><i class="icon-double-angle-right"></i> Calendar</a></li>
                                <li><a href="flot-chart.html"><i class="icon-double-angle-right"></i> Flot Chart</a></li>
                                <li><a href="google-chart.html"><i class="icon-double-angle-right"></i> Google Chart</a></li>
                            </ul>
                        </li>
                        <li><a href="#"><i class="icon-files"></i> Example Pages</a>
                            <ul>
                                <li><a href="content-post.html"><i class="icon-double-angle-right"></i> Content Post</a></li>
                                <li><a href="login.html"><i class="icon-double-angle-right"></i> Login</a></li>
                                <li><a href="product-list.html"><i class="icon-double-angle-right"></i> Products List</a></li>
                                <li><a href="gallery.html"><i class="icon-double-angle-right"></i> Gallery Page</a></li>
                                <li><a href="search-page.html"><i class="icon-double-angle-right"></i> Search Page</a></li>
                                <li><a href="error-page.html"><i class="icon-double-angle-right"></i> Error Page</a></li>
                                <li><a href="invoice-page.html"><i class="icon-double-angle-right"></i> Invoice</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
            <!-- SITE CONTAINER -->
            <div class="main-container">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12">
                            <!-- SHORTCUT BAR -->
                            <div class="shortcut-bar">
                                <ul class="shortcut-items">
                                    <li><a href="#"><span class="count-noty">02</span><i class="icon-screen-3"></i><span class="shortcut-label">Dashboard</span></a></li>
                                    <li><a href="#"><i class="icon-cogs"></i><span class="shortcut-label">Settings</span></a></li>
                                    <li><a href="#"><i class="icon-chart"></i><span class="shortcut-label">Statistics</span></a></li>
                                    <li><a href="#"><i class="icon-users-2"></i><span class="shortcut-label">Users</span></a></li>
                                    <li><a href="#"><i class="icon-file-8"></i><span class="shortcut-label">Content</span></a></li>
                                    <li><a href="#"><i class="icon-briefcase"></i><span class="shortcut-label">Media</span></a></li>
                                    <li><a href="#"><i class="icon-stack-list"></i><span class="shortcut-label">Task List</span></a></li>
                                    <li><a href="#"><i class="icon-folder"></i><span class="shortcut-label">Files</span></a></li>
                                    <li><a href="#"><i class="icon-coin"></i><span class="shortcut-label">Income</span></a></li>
                                </ul>
                            </div>
                            <div class="page-header">
                                <h1><i class="icon-file-5"></i> Example page header <small>Subtext for header</small></h1>
                            </div>
                            <ul class="breadcrumb">
                                <li><a href="#"><i class="icon-home"></i></a></li>
                                <li><a href="#">Library</a></li>
                                <li class="active">Data</li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="board-widget">
                        <div class="row">
                            <div class="col-sm-6 col-md-3">
                                <div class="board-widget-wrap">
                                    <a href="#"><i class="icon-users-2"></i><span class="board-widget-label">Users</span><span class="board-widget-intro"> Integer eros lorem, tempor vitae... </span></a>
                                </div>
                            </div>
                            <div class=" col-sm-6 col-md-3">
                                <div class="board-widget-wrap">
                                    <a href="#"><i class="icon-file-8"></i><span class="board-widget-label">Content </span><span class="board-widget-intro"> Vivamus lorem velit, tinci dunt... </span></a>
                                </div>
                            </div>
                            <div class="col-sm-6 col-md-3">
                                <div class="board-widget-wrap">
                                    <a href="#"><i class="icon-briefcase"></i><span class="board-widget-label">Media</span><span class="board-widget-intro"> Nullam tincidunt quam quis erat... </span><span class="count-noty">05</span></a>
                                </div>
                            </div>
                            <div class="col-sm-6 col-md-3">
                                <div class="board-widget-wrap">
                                    <a href="#"><i class="icon-chart"></i><span class="board-widget-label">Statistics</span><span class="board-widget-intro"> Vivamus mattis scelerisque auctor... </span><span class="count-noty">90</span></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="stat-board-widget">
                        <div class="row">
                            <div class="col-sm-6 col-md-3">
                                <div class="stat-widget-wrap">
                                    <div class="stat-widget-container">
                                        <ul class="clearfix">
                                            <li class="pull-left"><span class="stat-widget-icon"><i class="icon-envelop-opened"></i></span></li>
                                            <li class="pull-right stat-widget-info "><span class="stat-widget-count">554</span><span class="stat-widget-label">New Feedback</span></li>
                                        </ul>
                                        <a href="#" class="btn btn-default btn-block stat-btn ">View All</a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-md-3">
                                <div class="stat-widget-wrap">
                                    <div class="stat-widget-container">
                                        <ul class="clearfix">
                                            <li class="pull-left"><span class="stat-widget-icon"><i class=" icon-coin"></i></span></li>
                                            <li class="pull-right stat-widget-info "><span class="stat-widget-count">3254</span><span class="stat-widget-label">New Order</span></li>
                                        </ul>
                                        <a href="#" class="btn btn-default btn-block stat-btn ">View All</a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-md-3">
                                <div class="stat-widget-wrap">
                                    <div class="stat-widget-container">
                                        <ul class="clearfix">
                                            <li class="pull-left"><span class="stat-widget-icon"><i class="icon-clipboard-2"></i></span></li>
                                            <li class="pull-right stat-widget-info "><span class="stat-widget-count">453</span><span class="stat-widget-label">New Task</span></li>
                                        </ul>
                                        <a href="#" class="btn btn-default btn-block stat-btn">View All</a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-md-3">
                                <div class="stat-widget-wrap">
                                    <div class="stat-widget-container">
                                        <ul class="clearfix">
                                            <li class="pull-left"><span class="stat-widget-icon"><i class="icon-truck"></i></span></li>
                                            <li class="pull-right stat-widget-info "><span class="stat-widget-count">254</span><span class="stat-widget-label">Order Shipped</span></li>
                                        </ul>
                                        <a href="#" class="btn btn-default btn-block stat-btn ">View All</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="graph-board-widget">
                        <div class="row">
                            <div class="col-sm-6 col-md-3">
                                <div class="graph-widget-wrap">
                                    <div class="graph-widget-container">
                                        <h6>News Visits</h6>
                                        <div class="mini-graph">
                                            <div class="sparkbar">
                                            </div>
                                        </div>
                                        <ul class="clearfix">
                                            <li class="pull-left"><span class="graph-widget-icon"><i class="icon-arrow-up-6"></i> 10%</span></li>
                                            <li class="pull-right graph-widget-info "><span class="graph-widget-label">30000</span></li>
                                        </ul>
                                        <a href="#" class="btn btn-primary stat-btn ">View All</a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-md-3">
                                <div class="graph-widget-wrap">
                                    <div class="graph-widget-container">
                                        <h6>Page View</h6>
                                        <div class="mini-graph">
                                            <div class="sparkline">
                                            </div>
                                        </div>
                                        <ul class="clearfix">
                                            <li class="pull-left"><span class="graph-widget-icon"><i class="icon-arrow-down-5"></i> 10%</span></li>
                                            <li class="pull-right graph-widget-info "><span class="graph-widget-label">30000</span></li>
                                        </ul>
                                        <a href="#" class="btn btn-primary stat-btn ">View All</a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-md-3">
                                <div class="graph-widget-wrap">
                                    <div class="graph-widget-container">
                                        <h6>Unique Visits</h6>
                                        <div class="mini-graph">
                                            <div class="sparkpie">
                                            </div>
                                        </div>
                                        <ul class="clearfix">
                                            <li class="pull-left"><span class="graph-widget-icon"><i class="icon-arrow-up-6"></i> 10%</span></li>
                                            <li class="pull-right graph-widget-info "><span class="graph-widget-label">30000</span></li>
                                        </ul>
                                        <a href="#" class="btn btn-primary stat-btn ">View All</a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-md-3">
                                <div class="graph-widget-wrap">
                                    <div class="graph-widget-container">
                                        <h6>Transactions</h6>
                                        <div class="mini-graph">
                                            <div class="line-min-chart">
                                            </div>
                                        </div>
                                        <ul class="clearfix">
                                            <li class="pull-left"><span class="graph-widget-icon"><i class="icon-arrow-up-6"></i> 10%</span></li>
                                            <li class="pull-right graph-widget-info "><span class="graph-widget-label">30000</span></li>
                                        </ul>
                                        <a href="#" class="btn btn-primary stat-btn ">View All</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-3 col-md-2">
                            <div class="item-block">
                                <div class="icon-block orange-block">
                                    <span class="item-icon">
                                        <span class="contact_sl"><a href="#"><i class="icon-envelop-opened"></i></a></span>
                                    </span>
                                </div>
                                <h3>10</h3>
                                <p>
                                    Messages
                                </p>
                            </div>
                        </div>
                        <div class="col-sm-3 col-md-2">
                            <div class="item-block">
                                <div class="icon-block tur-block">
                                    <span class="item-icon">
                                        <span class="contact_sl"><a href="#"><i class="icon-coin"></i></a></span>
                                    </span>
                                </div>
                                <h3>$354</h3>
                                <p>
                                    Credits
                                </p>
                            </div>
                        </div>
                        <div class="col-sm-3 col-md-2">
                            <div class="item-block">
                                <div class="icon-block brown-block">
                                    <span class="item-icon">
                                        <span class="contact_sl"><a href="#"><i class="icon-cart-2"></i></a></span>
                                    </span>
                                </div>
                                <h3>100</h3>
                                <p>
                                    New Order
                                </p>
                            </div>
                        </div>
                        <div class="col-sm-3 col-md-2">
                            <div class="item-block">
                                <div class="icon-block gray-block">
                                    <span class="item-icon">
                                        <span class="contact_sl"><a href="#"><i class="icon-support"></i></a></span>
                                    </span>
                                </div>
                                <h3>240</h3>
                                <p>
                                    Support Tickets
                                </p>
                            </div>
                        </div>
                        <div class="col-sm-3 col-md-2">
                            <div class="item-block">
                                <div class="icon-block green-block">
                                    <span class="item-icon">
                                        <span class="contact_sl"><a href="#"><i class="icon-file-5"></i></a></span>
                                    </span>
                                </div>
                                <h3>120</h3>
                                <p>
                                    Articles
                                </p>
                            </div>
                        </div>
                        <div class="col-sm-3 col-md-2">
                            <div class="item-block">
                                <div class="icon-block blue-block">
                                    <span class="item-icon">
                                        <span><a href="#"><i class="icon-file-alt"></i></a></span>
                                    </span>
                                </div>
                                <h3>60</h3>
                                <p>
                                    Pages
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6 widget-module">
                            <div class="square-widget widget-collapsible">
                                <div class="widget-head clearfix">
                                    <h4 class="pull-left"><i class="icon-user"></i> Recent Users</h4>
                                    <span class="pull-right widget-action"><a href="#" class="widget-collapse"><i class="icon-arrow-down"></i></a><a href="#" class="widget-remove"><i class=" icon-remove-sign"></i></a></span>
                                </div>
                                <div class="widget-container">
                                    <div class="users-lists">
                                        <div class="widget-search-bar clearfix">
                                            <div class="pull-left">
                                                <form class="form-search">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control">
                                                        <span class="input-group-btn">
                                                            <button type="button" class="btn btn-default">Go!</button>
                                                        </span>
                                                    </div>
                                                </form>
                                            </div>
                                            <div class="pull-right">
                                                <a href="#">View All</a>
                                            </div>
                                        </div>
                                        <div class="support-ticket-scroll">
                                            <div class="elements-wrap clearfix">
                                                <div class="user-thumbnil">
                                                    <a href="#"><img src="images/user-thumb1.png" width="40" height="40" alt="user"></a>
                                                </div>
                                                <div class="element-content">
                                                    <ul>
                                                        <li>Name: <a href="#">Jaman</a></li>
                                                        <li>IP: 192.168.1.1</li>
                                                        <li>User Type: Paid, Package Name:Gold</li>
                                                    </ul>
                                                </div>
                                                <div class="btn-toolbar clearfix">
                                                    <div class="btn-group pull-left">
                                                        <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                        <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                        <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                    </div>
                                                    <div class="btn-group pull-right">
                                                        <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="elements-wrap clearfix">
                                                <div class="user-thumbnil">
                                                    <a href="#"><img src="images/user-thumb2.png" width="40" height="40" alt="user"></a>
                                                </div>
                                                <div class="element-content">
                                                    <ul>
                                                        <li>Name: <a href="#">Jaman</a></li>
                                                        <li>IP: 192.168.1.1</li>
                                                        <li>User Type: Paid, Package Name:Gold</li>
                                                    </ul>
                                                </div>
                                                <div class="btn-toolbar clearfix">
                                                    <div class="btn-group pull-left">
                                                        <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                        <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                        <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                    </div>
                                                    <div class="btn-group pull-right">
                                                        <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="elements-wrap clearfix">
                                                <div class="user-thumbnil">
                                                    <a href="#"><img src="images/user-thumb3.png" width="40" height="40" alt="user"></a>
                                                </div>
                                                <div class="element-content">
                                                    <ul>
                                                        <li>Name: <a href="#">Jaman</a></li>
                                                        <li>IP: 192.168.1.1</li>
                                                        <li>User Type: Paid, Package Name:Gold</li>
                                                    </ul>
                                                </div>
                                                <div class="btn-toolbar clearfix">
                                                    <div class="btn-group pull-left">
                                                        <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                        <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                        <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                    </div>
                                                    <div class="btn-group pull-right">
                                                        <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="elements-wrap clearfix">
                                                <div class="user-thumbnil">
                                                    <a href="#"><img src="images/user-thumb4.png" width="40" height="40" alt="user"></a>
                                                </div>
                                                <div class="element-content">
                                                    <ul>
                                                        <li>Name: <a href="#">Jaman</a></li>
                                                        <li>IP: 192.168.1.1</li>
                                                        <li>User Type: Paid, Package Name:Gold</li>
                                                    </ul>
                                                </div>
                                                <div class="btn-toolbar clearfix">
                                                    <div class="btn-group pull-left">
                                                        <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                        <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                        <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                    </div>
                                                    <div class="btn-group pull-right">
                                                        <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="elements-wrap clearfix">
                                                <div class="user-thumbnil">
                                                    <a href="#"><img src="images/user-thumb5.png" width="40" height="40" alt="user"></a>
                                                </div>
                                                <div class="element-content">
                                                    <ul>
                                                        <li>Name: <a href="#">Jaman</a></li>
                                                        <li>IP: 192.168.1.1</li>
                                                        <li>User Type: Paid, Package Name:Gold</li>
                                                    </ul>
                                                </div>
                                                <div class="btn-toolbar clearfix">
                                                    <div class="btn-group pull-left">
                                                        <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                        <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                        <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                    </div>
                                                    <div class="btn-group pull-right">
                                                        <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="elements-wrap clearfix">
                                                <div class="user-thumbnil">
                                                    <a href="#"><img src="images/user-thumb6.png" width="40" height="40" alt="user"></a>
                                                </div>
                                                <div class="element-content">
                                                    <ul>
                                                        <li>Name: <a href="#">Jaman</a></li>
                                                        <li>IP: 192.168.1.1</li>
                                                        <li>User Type: Paid, Package Name:Gold</li>
                                                    </ul>
                                                </div>
                                                <div class="btn-toolbar clearfix">
                                                    <div class="btn-group pull-left">
                                                        <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                        <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                        <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                    </div>
                                                    <div class="btn-group pull-right">
                                                        <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="widge-bottom-bar">
                                            <div class=" pagination-centered">
                                                <ul class="pagination">
                                                    <li class="disabled"><a href="#">«</a></li>
                                                    <li class="active"><a href="#">1</a></li>
                                                    <li><a href="#">2</a></li>
                                                    <li><a href="#">3</a></li>
                                                    <li><a href="#">4</a></li>
                                                    <li><a href="#">5</a></li>
                                                    <li><a href="#">»</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6 widget-module">
                            <div class="square-widget widget-collapsible">
                                <div class="widget-head clearfix">
                                    <h4 class="pull-left"><i class="icon-file"></i> Recent Post</h4>
                                    <span class="pull-right widget-action"><a href="#" class="widget-collapse"><i class="icon-arrow-down"></i></a><a href="#" class="widget-remove"><i class=" icon-remove-sign"></i></a></span>
                                </div>
                                <div class="widget-container">
                                    <table class=" table responsive">
                                        <thead>
                                            <tr>
                                                <th>
                                                    Id
                                                </th>
                                                <th>
                                                    Details
                                                </th>
                                                <th>
                                                    Submit Date
                                                </th>
                                                <th>
                                                    Submited By
                                                </th>
                                                <th>
                                                    Status
                                                </th>
                                                <th>
                                                    Publish Date
                                                </th>
                                                <th>
                                                    Action
                                                </th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>
                                                    <a href="#">01</a>
                                                </td>
                                                <td>
                                                    <a href="#">Pellentesque ut massa ut ligula ... </a>
                                                </td>
                                                <td>
                                                    1st MAY 2013
                                                </td>
                                                <td>
                                                    Jaman
                                                </td>
                                                <td>
                                                    <span class="label label-success">Publish</span>
                                                </td>
                                                <td>
                                                    3rd MAY 2013
                                                </td>
                                                <td class="action-bar">
                                                    <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <a href="#">02</a>
                                                </td>
                                                <td>
                                                    <a href="#">Nulla non ante dui, sit amet ... </a>
                                                </td>
                                                <td>
                                                    1st MAY 2013
                                                </td>
                                                <td>
                                                    Jhon
                                                </td>
                                                <td>
                                                    <span class="label label-success">Publish</span>
                                                </td>
                                                <td>
                                                    3rd MAY 2013
                                                </td>
                                                <td class="action-bar">
                                                    <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <a href="#">03</a>
                                                </td>
                                                <td>
                                                    <a href="#">Aliquam eu pellentesque... </a>
                                                </td>
                                                <td>
                                                    1st MAY 2013
                                                </td>
                                                <td>
                                                    Mike
                                                </td>
                                                <td>
                                                    <span class="label label-success">Publish</span>
                                                </td>
                                                <td>
                                                    3rd MAY 2013
                                                </td>
                                                <td class="action-bar">
                                                    <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <a href="#">04</a>
                                                </td>
                                                <td>
                                                    <a href="#">Maecenas egestas alique... </a>
                                                </td>
                                                <td>
                                                    1st MAY 2013
                                                </td>
                                                <td>
                                                    Sam
                                                </td>
                                                <td>
                                                    <span class="label label-warning">Pending</span>
                                                </td>
                                                <td>
                                                    -
                                                </td>
                                                <td class="action-bar">
                                                    <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <a href="#">01</a>
                                                </td>
                                                <td>
                                                    <a href="#">Pellentesque ut massa ut ligula ... </a>
                                                </td>
                                                <td>
                                                    1st MAY 2013
                                                </td>
                                                <td>
                                                    Jaman
                                                </td>
                                                <td>
                                                    <span class="label label-success">Publish</span>
                                                </td>
                                                <td>
                                                    3rd MAY 2013
                                                </td>
                                                <td class="action-bar">
                                                    <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <a href="#">02</a>
                                                </td>
                                                <td>
                                                    <a href="#">Nulla non ante dui, sit amet ... </a>
                                                </td>
                                                <td>
                                                    1st MAY 2013
                                                </td>
                                                <td>
                                                    Jhon
                                                </td>
                                                <td>
                                                    <span class="label label-success">Publish</span>
                                                </td>
                                                <td>
                                                    3rd MAY 2013
                                                </td>
                                                <td class="action-bar">
                                                    <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                    <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6 widget-module">
                            <div class="square-widget widget-collapsible">
                                <div class="widget-head clearfix">
                                    <h4 class="pull-left"><i class="icon-location"></i> Geo Map</h4>
                                    <span class="pull-right widget-action"><a href="#" class="widget-collapse"><i class="icon-arrow-down"></i></a><a href="#" class="widget-remove"><i class=" icon-remove-sign"></i></a></span>
                                </div>
                                <div class="widget-container">
                                    <div id="chart_div">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="box-widget widget-module">
                                <div class="widget-head clearfix">
                                    <span class="h-icon"><i class=" icon-user"></i></span>
                                    <h4 class="pull-left">Recent Users</h4>
                                    <div class="pull-right widget-action">
                                        <ul>
                                            <li><a href="#" class="widget-collapse"><i class="icon-arrow-down"></i></a></li>
                                            <li><a href="#" class="widget-remove"><i class=" icon-remove-sign"></i></a></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="widget-container">
                                    <div class="widget-block">
                                        <div class="widget-content">
                                            <!--box-spacing define 20px padding for all content here-->
                                            <div class="users-lists">
                                                <div class="widget-search-bar clearfix">
                                                    <div class="pull-left">
                                                        <form class="form-search">
                                                            <div class="input-group">
                                                                <input type="text" class="form-control">
                                                                <span class="input-group-btn">
                                                                    <button type="button" class="btn btn-default">Go!</button>
                                                                </span>
                                                            </div>
                                                        </form>
                                                    </div>
                                                    <div class="pull-right">
                                                        <a href="#">View All</a>
                                                    </div>
                                                </div>
                                                <div class="recent-users-scroll">
                                                    <div class="elements-wrap clearfix">
                                                        <div class="user-thumbnil">
                                                            <a href="#"><img src="images/user-thumb7.png" width="40" height="40" alt="user"></a>
                                                        </div>
                                                        <div class="element-content">
                                                            <ul>
                                                                <li>Name: <a href="#">Jaman</a></li>
                                                                <li>IP: 192.168.1.1</li>
                                                                <li>User Type: Paid, Package Name:Gold</li>
                                                            </ul>
                                                        </div>
                                                        <div class="btn-toolbar clearfix">
                                                            <div class="btn-group pull-left">
                                                                <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                                <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                                <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                            </div>
                                                            <div class="btn-group pull-right">
                                                                <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="elements-wrap clearfix">
                                                        <div class="user-thumbnil">
                                                            <a href="#"><img src="images/user-thumb1.png" width="40" height="40" alt="user"></a>
                                                        </div>
                                                        <div class="element-content">
                                                            <ul>
                                                                <li>Name: <a href="#">Jaman</a></li>
                                                                <li>IP: 192.168.1.1</li>
                                                                <li>User Type: Paid, Package Name:Gold</li>
                                                            </ul>
                                                        </div>
                                                        <div class="btn-toolbar clearfix">
                                                            <div class="btn-group pull-left">
                                                                <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                                <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                                <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                            </div>
                                                            <div class="btn-group pull-right">
                                                                <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="elements-wrap clearfix">
                                                        <div class="user-thumbnil">
                                                            <a href="#"><img src="images/user-thumb2.png" width="40" height="40" alt="user"></a>
                                                        </div>
                                                        <div class="element-content">
                                                            <ul>
                                                                <li>Name: <a href="#">Jaman</a></li>
                                                                <li>IP: 192.168.1.1</li>
                                                                <li>User Type: Paid, Package Name:Gold</li>
                                                            </ul>
                                                        </div>
                                                        <div class="btn-toolbar clearfix">
                                                            <div class="btn-group pull-left">
                                                                <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                                <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                                <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                            </div>
                                                            <div class="btn-group pull-right">
                                                                <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="elements-wrap clearfix">
                                                        <div class="user-thumbnil">
                                                            <a href="#"><img src="images/user-thumb3.png" width="40" height="40" alt="user"></a>
                                                        </div>
                                                        <div class="element-content">
                                                            <ul>
                                                                <li>Name: <a href="#">Jaman</a></li>
                                                                <li>IP: 192.168.1.1</li>
                                                                <li>User Type: Paid, Package Name:Gold</li>
                                                            </ul>
                                                        </div>
                                                        <div class="btn-toolbar clearfix">
                                                            <div class="btn-group pull-left">
                                                                <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                                <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                                <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                            </div>
                                                            <div class="btn-group pull-right">
                                                                <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="elements-wrap clearfix">
                                                        <div class="user-thumbnil">
                                                            <a href="#"><img src="images/user-thumb4.png" width="40" height="40" alt="user"></a>
                                                        </div>
                                                        <div class="element-content">
                                                            <ul>
                                                                <li>Name: <a href="#">Jaman</a></li>
                                                                <li>IP: 192.168.1.1</li>
                                                                <li>User Type: Paid, Package Name:Gold</li>
                                                            </ul>
                                                        </div>
                                                        <div class="btn-toolbar clearfix">
                                                            <div class="btn-group pull-left">
                                                                <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                                <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                                <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Suspend</button>
                                                            </div>
                                                            <div class="btn-group pull-right">
                                                                <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="widge-bottom-bar">
                                                    <div class="pagination-centered">
                                                        <ul class="pagination ">
                                                            <li class="disabled"><a href="#">«</a></li>
                                                            <li class="active"><a href="#">1</a></li>
                                                            <li><a href="#">2</a></li>
                                                            <li><a href="#">3</a></li>
                                                            <li><a href="#">4</a></li>
                                                            <li><a href="#">5</a></li>
                                                            <li><a href="#">»</a></li>
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 widget-module">
                            <div class="box-widget">
                                <div class="widget-head clearfix">
                                    <span class="h-icon"><i class="icon-user"></i></span>
                                    <h4 class="pull-left">Recent Users</h4>
                                    <div class="pull-right widget-action">
                                        <ul>
                                            <li><a href="#" class="widget-collapse"><i class="icon-arrow-down"></i></a></li>
                                            <li><a href="#" class="widget-remove"><i class=" icon-remove-sign"></i></a></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="widget-container">
                                    <div class="widget-block">
                                        <div class="widget-content">
                                            <!--box-spacing define 20px padding for all content here-->
                                            <table class="table responsive">
                                                <thead>
                                                    <tr>
                                                        <th>
                                                            User Name
                                                        </th>
                                                        <th>
                                                            Name
                                                        </th>
                                                        <th>
                                                            Address
                                                        </th>
                                                        <th>
                                                            Email
                                                        </th>
                                                        <th>
                                                            Thumb
                                                        </th>
                                                        <th>
                                                            Status
                                                        </th>
                                                        <th>
                                                            Action
                                                        </th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <a href="#">Jhon</a>
                                                        </td>
                                                        <td>
                                                            <a href="#">Jhon Doe</a>
                                                        </td>
                                                        <td>
                                                            Address Line
                                                        </td>
                                                        <td>
                                                            jhon@hostname.com
                                                        </td>
                                                        <td>
                                                            <div class="user-thumb">
                                                                <a href="#"><img height="40" width="40" alt="User" src="images/user-thumb1.png"></a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <span class="label label-info">New</span> <span class="label label-warning">Pending</span>
                                                        </td>
                                                        <td class="action-bar">
                                                            <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <a href="#">Jaman</a>
                                                        </td>
                                                        <td>
                                                            <a href="#">Ui Jaman</a>
                                                        </td>
                                                        <td>
                                                            Address Line
                                                        </td>
                                                        <td>
                                                            jaman@hostname.com
                                                        </td>
                                                        <td>
                                                            <div class="user-thumb">
                                                                <a href="#"><img height="40" width="40" alt="User" src="images/user-thumb2.png"></a>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <span class="label label-danger">Suspended</span>
                                                        </td>
                                                        <td class="action-bar">
                                                            <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 widget-module">
                            <div class="box-widget">
                                <div class="widget-head clearfix">
                                    <span class="h-icon"><i class=" icon-file"></i></span>
                                    <h4 class="pull-left">Recent Post</h4>
                                    <div class="pull-right widget-action">
                                        <ul>
                                            <li><a href="#" class="widget-collapse"><i class="icon-arrow-down"></i></a></li>
                                            <li><a href="#" class="widget-remove"><i class=" icon-remove-sign"></i></a></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="widget-container">
                                    <div class="widget-block">
                                        <div class="widget-content">
                                            <!--box-spacing define 20px padding for all content here-->
                                            <table class=" table responsive">
                                                <thead>
                                                    <tr>
                                                        <th>
                                                            Id
                                                        </th>
                                                        <th>
                                                            Details
                                                        </th>
                                                        <th>
                                                            Submit Date
                                                        </th>
                                                        <th>
                                                            Submited By
                                                        </th>
                                                        <th>
                                                            Status
                                                        </th>
                                                        <th>
                                                            Publish Date
                                                        </th>
                                                        <th>
                                                            Action
                                                        </th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <a href="#">01</a>
                                                        </td>
                                                        <td>
                                                            <a href="#">Pellentesque ut massa ut ligula ... </a>
                                                        </td>
                                                        <td>
                                                            1st MAY 2013
                                                        </td>
                                                        <td>
                                                            Jaman
                                                        </td>
                                                        <td>
                                                            <span class="label label-success">Publish</span>
                                                        </td>
                                                        <td>
                                                            3rd MAY 2013
                                                        </td>
                                                        <td class="action-bar">
                                                            <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <a href="#">02</a>
                                                        </td>
                                                        <td>
                                                            <a href="#">Nulla non ante dui, sit amet ... </a>
                                                        </td>
                                                        <td>
                                                            1st MAY 2013
                                                        </td>
                                                        <td>
                                                            Jhon
                                                        </td>
                                                        <td>
                                                            <span class="label label-success">Publish</span>
                                                        </td>
                                                        <td>
                                                            3rd MAY 2013
                                                        </td>
                                                        <td class="action-bar">
                                                            <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <a href="#">03</a>
                                                        </td>
                                                        <td>
                                                            <a href="#">Aliquam eu pellentesque... </a>
                                                        </td>
                                                        <td>
                                                            1st MAY 2013
                                                        </td>
                                                        <td>
                                                            Mike
                                                        </td>
                                                        <td>
                                                            <span class="label label-success">Publish</span>
                                                        </td>
                                                        <td>
                                                            3rd MAY 2013
                                                        </td>
                                                        <td class="action-bar">
                                                            <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>
                                                            <a href="#">04</a>
                                                        </td>
                                                        <td>
                                                            <a href="#">Maecenas egestas alique... </a>
                                                        </td>
                                                        <td>
                                                            1st MAY 2013
                                                        </td>
                                                        <td>
                                                            Sam
                                                        </td>
                                                        <td>
                                                            <span class="label label-warning">Pending</span>
                                                        </td>
                                                        <td>
                                                            -
                                                        </td>
                                                        <td class="action-bar">
                                                            <a href="#" title="Edit" class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-danger"><i class="icon-remove-2"></i></a>
                                                            <a href="#" title="Edit" class="btn btn-mini btn-success"><i class="icon-ok"></i></a>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6 widget-module">
                            <div class="box-widget">
                                <div class="widget-head clearfix">
                                    <span class="h-icon"><i class="icon-support"></i></span>
                                    <h4 class="pull-left">Support Tickets</h4>
                                    <div class="pull-right widget-action">
                                        <ul>
                                            <li><a href="#" class="widget-collapse"><i class="icon-arrow-down"></i></a></li>
                                            <li><a href="#" class="widget-remove"><i class=" icon-remove-sign"></i></a></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="widget-container">
                                    <div class="widget-block">
                                        <div class="widget-content">
                                            <!--box-spacing define 20px padding for all content here-->
                                            <div class="users-lists">
                                                <div class="widget-search-bar clearfix">
                                                    <div class="pull-left">
                                                        <form class="form-search">
                                                            <div class="input-group">
                                                                <input type="text" class="form-control">
                                                                <span class="input-group-btn">
                                                                    <button type="button" class="btn btn-default">Go!</button>
                                                                </span>
                                                            </div>
                                                        </form>
                                                    </div>
                                                    <div class="pull-right">
                                                        <a href="#">View All</a>
                                                    </div>
                                                </div>
                                                <div class="elements-wrap clearfix">
                                                    <div class="user-thumbnil">
                                                        <img src="images/user-thumb1.png" width="40" height="40" alt="user">
                                                    </div>
                                                    <div class="element-content">
                                                        <ul>
                                                            <li><span class="user-info"> User: <a href="#">kjaman</a> on IP: 192.118.1.1 <b>ID #12467RS</b></span></li>
                                                            <li><a href="#">Suspendisse convallis laoreet lectus in aliquam. Vivamus quis elit nisl, ut posuere leo.</a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="btn-toolbar clearfix">
                                                        <div class="btn-group pull-left">
                                                            <button class="btn btn-mini btn-primary"><i class="icon-reply"></i> Reply</button>
                                                            <button class="btn btn-mini btn-inverse"><i class="icon-forward"></i> Forward</button>
                                                        </div>
                                                        <div class="btn-group pull-right">
                                                            <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Resolved</button>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="widge-bottom-bar">
                                                    <div class="pagination-centered">
                                                        <ul class="pagination">
                                                            <li class="disabled"><a href="#">«</a></li>
                                                            <li class="active"><a href="#">1</a></li>
                                                            <li><a href="#">2</a></li>
                                                            <li><a href="#">3</a></li>
                                                            <li><a href="#">4</a></li>
                                                            <li><a href="#">5</a></li>
                                                            <li><a href="#">»</a></li>
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6 widget-module">
                            <div class="box-widget">
                                <div class="widget-head clearfix">
                                    <span class="h-icon"><i class=" icon-file-10"></i></span>
                                    <h4 class="pull-left">Recent Posts</h4>
                                    <div class="pull-right widget-action">
                                        <ul>
                                            <li><a href="#" class="widget-collapse"><i class="icon-arrow-down"></i></a></li>
                                            <li><a href="#" class="widget-remove"><i class=" icon-remove-sign"></i></a></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="widget-container">
                                    <div class="widget-block">
                                        <div class="widget-content">
                                            <!--box-spacing define 20px padding for all content here-->
                                            <div class="users-lists">
                                                <div class="widget-search-bar clearfix">
                                                    <div class="pull-left">
                                                        <form class="form-search">
                                                            <div class="input-group">
                                                                <input type="text" class="form-control">
                                                                <span class="input-group-btn">
                                                                    <button type="button" class="btn btn-default">Go!</button>
                                                                </span>
                                                            </div>
                                                        </form>
                                                    </div>
                                                    <div class="pull-right">
                                                        <a href="#">View All</a>
                                                    </div>
                                                </div>
                                                <div class="elements-wrap clearfix">
                                                    <div class="user-thumbnil">
                                                        <img src="images/user-thumb1.png" width="40" height="40" alt="user">
                                                    </div>
                                                    <div class="element-content">
                                                        <ul>
                                                            <li class="element-meta"><span>Posted By: <a href="#">Joe Smith</a></span><span>Date: 30th April 2013</span><span>Total Post: <a href="#">30</a></span></li>
                                                            <li><a href="#">Suspendisse convallis laoreet lectus in aliquam. Vivamus quis elit nisl, ut posuere leo.</a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="btn-toolbar clearfix">
                                                        <div class="btn-group pull-left">
                                                            <button class="btn btn-mini btn-primary"><i class="icon-pencil-2"></i> Edit</button>
                                                            <button class="btn btn-mini btn-danger"><i class="icon-remove-2"></i> Delete</button>
                                                            <button class="btn btn-mini btn-inverse"><i class="icon-remove-sign"></i> Reject</button>
                                                        </div>
                                                        <div class="btn-group pull-right">
                                                            <button class="btn btn-mini btn-success"><i class="icon-ok"></i> Approved</button>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="widge-bottom-bar">
                                                    <div class="pagination-centered">
                                                        <ul class="pagination">
                                                            <li class="disabled"><a href="#">«</a></li>
                                                            <li class="active"><a href="#">1</a></li>
                                                            <li><a href="#">2</a></li>
                                                            <li><a href="#">3</a></li>
                                                            <li><a href="#">4</a></li>
                                                            <li><a href="#">5</a></li>
                                                            <li><a href="#">»</a></li>
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <table class="table table-bordered table-striped responsive">
                                <thead>
                                    <tr>
                                        <th>
                                            Button
                                        </th>
                                        <th>
                                            class=""
                                        </th>
                                        <th>
                                            Description
                                        </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>
                                            <button class="btn" type="button">Default</button>
                                        </td>
                                        <td>
                                            <code>btn</code>
                                        </td>
                                        <td>
                                            Standard gray button with gradient
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <button class="btn btn-primary" type="button">Primary</button>
                                        </td>
                                        <td>
                                            <code>btn btn-primary</code>
                                        </td>
                                        <td>
                                            Provides extra visual weight and identifies the primary action in a set of buttons
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <button class="btn btn-info" type="button">Info</button>
                                        </td>
                                        <td>
                                            <code>btn btn-info</code>
                                        </td>
                                        <td>
                                            Used as an alternative to the default styles
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <button class="btn btn-success" type="button">Success</button>
                                        </td>
                                        <td>
                                            <code>btn btn-success</code>
                                        </td>
                                        <td>
                                            Indicates a successful or positive action
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <button class="btn btn-warning" type="button">Warning</button>
                                        </td>
                                        <td>
                                            <code>btn btn-warning</code>
                                        </td>
                                        <td>
                                            Indicates caution should be taken with this action
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <button class="btn btn-danger" type="button">Danger</button>
                                        </td>
                                        <td>
                                            <code>btn btn-danger</code>
                                        </td>
                                        <td>
                                            Indicates a dangerous or potentially negative action
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <button class="btn btn-inverse" type="button">Inverse</button>
                                        </td>
                                        <td>
                                            <code>btn btn-inverse</code>
                                        </td>
                                        <td>
                                            Alternate dark gray button, not tied to a semantic action or use
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <button class="btn btn-link" type="button">Link</button>
                                        </td>
                                        <td>
                                            <code>btn btn-link</code>
                                        </td>
                                        <td>
                                            Deemphasize a button by making it look like a link while maintaining button behavior
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script src="js/jquery-ui-1.10.3.custom.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/prettify.js"></script>
        <!--jQuery touch scroll -->
        <script src="js/jquery.nicescroll.js"></script>
        <script src='js/jquery.cookie.js'></script>
        <script src='js/jquery.hoverIntent.minified.js'></script>
        <!--jQuery leftbar navigation accordion -->
        <script src='js/jquery.dcjqaccordion.2.7.js'></script>
        <!--jQuery Responsive Table -->
        <script src="js/responsive-tables.js"></script>
        <!--jQuery mini chart -->
        <script src="js/jquery.sparkline.min.js"></script>
        <!-- Google JS API -->
        <script src="https://www.google.com/jsapi"></script>
        <!-- Theme common script -->
        
        <script src='js/common-script.js'></script>
        <!--[if lte IE 7]>
                        <script src="js/font-alpona-ie7.js"></script>
                <![endif]-->
        <script>
            google.load('visualization', '1', {'packages': ['geochart']});
            google.setOnLoadCallback(drawRegionsMap);
            function drawRegionsMap() {
                var data = google.visualization.arrayToDataTable([
                    ['Country', 'Popularity'],
                    ['Germany', 200],
                    ['United States', 300],
                    ['Brazil', 400],
                    ['Canada', 500],
                    ['France', 600],
                    ['RU', 700]
                ]);
                var options = {
                    colorAxis: {colors: ['#009600', '#e88a05', '#3498db']}
                };
                var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
                chart.draw(data, options);
            }
            ;
        </script>
        <script>
            /*====MINI CHART ====*/
            $(function() {
                $(".sparkbar").sparkline([5, 6, 7, 2, 0, -4, -2, 4, 8, 20], {
                    type: 'bar',
                    height: '50',
                    barWidth: 6,
                    barSpacing: 2,
                    barColor: '#5fbf00',
                    negBarColor: '#bf0000',
                    tooltipFormat: '<span class="spark-tip"><span style="color: {{color}}">&#9679;</span> {{offset:names}} ({{percent.1}}%)</span>'
                });
            });
            $(function() {
                $(".sparkline").sparkline([5, 6, 7, 2, 0, -4, -2, 4, 8, 20], {
                    type: 'line',
                    height: '50',
                    width: '100',
                    barWidth: 6,
                    barSpacing: 2,
                    barColor: '#5fbf00',
                    negBarColor: '#bf0000',
                    tooltipFormat: '<span class="spark-tip"><span style="color: {{color}}">&#9679;</span> {{offset:names}} ({{percent.1}}%)</span>'
                });
            });
            $(function() {
                $(".sparkpie").sparkline([5, 6, 7, 2, 0, -4, -2, 4, 8, 20], {
                    type: 'pie',
                    height: '50',
                    barWidth: 6,
                    barSpacing: 2,
                    barColor: '#5fbf00',
                    negBarColor: '#bf0000',
                    tooltipFormat: '<span class="spark-tip"><span style="color: {{color}}">&#9679;</span> {{offset:names}} ({{percent.1}}%)</span>'
                });
            });
            $(function() {
                $(".line-min-chart").sparkline([50, 10, 2, 3, 40, 5, 26, 10, 15, 20, 40, 60], {
                    type: 'line',
                    width: '100',
                    height: '50',
                    lineColor: '#2b2b2b',
                    fillColor: '#e5e5e5',
                    lineWidth: 2,
                    highlightSpotColor: '#0e8e0e',
                    spotRadius: 3,
                    drawNormalOnTop: true
                });
                $(".bar-min-chart").sparkline([50, 10, 2, 3, 40, 5, 26, 10, -15, 20, 40, 60], {
                    type: 'bar',
                    height: '60',
                    barWidth: 4,
                    barSpacing: 1,
                    barColor: '#007f00'
                });
                $(".pie-min-chart").sparkline([3, 5, 2, 10, 8], {
                    type: 'pie',
                    width: '60',
                    height: '60'
                });
                $(".tristate-min-chart").sparkline([1, 1, 0, 1, -1, -1, 1, -1, 0, 0, 1, 1], {
                    type: 'tristate',
                    height: '50',
                    posBarColor: '#bf005f',
                    negBarColor: '#ff7f00',
                    zeroBarColor: '#545454',
                    barWidth: 6,
                    barSpacing: 1
                });
            });
        </script>
    </body>
</html>